import { Component, ViewChild, ChangeDetectorRef } from '@angular/core';
import { NavController, Platform, IonSlides } from '@ionic/angular';
import { ShopService } from '../services/shop.service';
import { ToastService } from '../providers/toast/toast.service';
import * as constants from '../providers/Constants'
import { Storage } from '../providers/Storage';
import { Helper } from '../providers/Helper';
import { Utils } from '../providers/Utils';

@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss']
})
export class Tab1Page {
  @ViewChild(IonSlides, null) slides: IonSlides;
  slideOpts: any = {
    initialSlide: 1,
    autoplay: {
      delay: 5000, //轮播图时间
      disableOnInteraction: false//这个属性很关键，拖动完自动播放
    },

    loop: true,
    speed: 400,
    // spaceBetween: 12 //px中幻灯片之间的距离。
  };
  procNewProcArray: any = [];
  headerSlideData: any = [];
  imageUrl: string = '';
  searchValue: string = 'Search Product';
  menuList: any = [
    { id: 'm1', value: '热门', select: true },
    { id: 'm2', value: '女装', select: false },
    { id: 'm3', value: '食品', select: false },
    { id: 'm4', value: '水果', select: false },
    { id: 'm5', value: '鞋包', select: false },
    { id: 'm6', value: '百货', select: false },
    { id: 'm7', value: '母婴', select: false },
    { id: 'm8', value: '鞋包1', select: false },
    { id: 'm9', value: '百货2', select: false },
  ];//菜单列表
  constructor(private nav: NavController,
    private mHelper: Helper,
    private service: ShopService,
    private platform: Platform,
    private ref: ChangeDetectorRef,
    private toast: ToastService
  ) {
    this.platform.ready().then(() => {
      this.imageUrl=this.service.getImageUrl()
      this.getSelFaceNewProcList();
      this.getRotationChart();

    })
  }
  onClickUrl(item) {
    console.log(item);
    // if (item.procId==null) {
    //   procId=item.bannerName
    // }
    this.nav.navigateForward(['/goods-details'], {
      queryParams: {
        type: 1,
        shopInfo: JSON.stringify({
          procImg: "d3d1643f-4595-49b4-a84e-ad44fd75db27",
          merchCode: item.merchCode,
          procId:item.procId,
        })
      }
    });
  }

  segmentChanged(event) {
    console.log(event);
    this.menuList.forEach((element, index) => {
      console.log(event.detail.value + '===', element.id);
      if (event.detail.value == element.id) {
        this.menuList[index].select = true;
      } else {
        this.menuList[index].select = false;
      }
    });
    console.log(this.menuList);
  }
  // 界面重新进入时，轮播图自动播放
  ionViewWillEnter() {
    this.slides.startAutoplay();
    // let value = Storage.localStorage.get('searchValue');
    // if (value != null) {
    //   this.searchValue = value;
    // }

  }
  // 退出界面时，轮播图停止
  ionViewWillLeave() {

    this.slides.stopAutoplay();
  }
  onLinkTo(str) {
    this.nav.navigateForward('goods-search-list', {
      queryParams: {
        searchType: 1,
        goodsInfo: JSON.stringify({
          searchValue: str
        })
      }
    });
  }
  AmountOfConversion(num: number) {
    if (!isNaN(num)) return num / 100;
    return 0;
  }
  onTtKeFu() {
    let phone = Storage.localStorage.get('userPhone');
    if (phone) {
      this.nav.navigateForward('ttkefu');
    } else {
      this.mHelper.alert('Show', "Please Login", res => {
        Storage.localStorage.clear();
        this.nav.navigateForward('login');
      });
    }
  }
  
  routerLink(type) {
    this.nav.navigateForward(['/time-aty'], {
      queryParams: {
        type: type //1 限时秒杀   2团购
      }
    })
  }

  search() {
    console.log('---------------------');
    this.nav.navigateForward(['/goods-search'], {
      queryParams: {
        type: '1' //1 首页
      }
    })
  }


  solaImage(img){
    return Utils.imageUrl(this.imageUrl,img);
  }

  onClickItem(item) {
    this.nav.navigateForward(['/goods-details'], {
      queryParams: {
        shopInfo: JSON.stringify(item),
      }
    });
  }

  getRotationChart() {
    this.service.getRotationChart({

    }).subscribe(res => {
      if (res.retCode == '000000') {
        for (let index = 0; index < res.array.length; index++) {
          const element = res.array[index];
          element.newsCapImg = this.service.getImageUrl() + element.newsCapImg.split(',')[0]
        }
        this.headerSlideData = res.array;
        this.ref.detectChanges();
        this.ref.markForCheck();
        // this.getHeaderSlideData(res.array);
        // this.isAttractImage = true;
      } else if (constants.errCode[res.retCode]) {
        if (constants.errCode[res.retCode] != '0') { this.toast.show(constants.errCode[res.retCode]); }
      } else if (res.retMsg) {
        this.toast.show(res.retMsg);
      } else {
        this.toast.show("exception service routine");
      }
    });
  }

  getSelFaceNewProcList() {
    this.service.getSelFaceNewProcList({}).subscribe(res => {
      // 保存成功返沪上一页，否则弹出提示框
      if (res.retCode == '000000') {
        console.log('完成了',res.procNewProcArray);
        // res.procNewProcArray[0].procName='ijoseijoeroijioeiojdegioiodfio'
        this.procNewProcArray = res.procNewProcArray;
      } else if (constants.errCode[res.retCode]) {
        if (constants.errCode[res.retCode] != '0') {
          this.toast.show(constants.errCode[res.retCode]);
        }
      } else if (res.retMsg) {
        this.toast.show(res.retMsg);
      } else {
        this.toast.show("exception service routine");
      }
    });
  }


}
